import QtQuick 2.0

Rectangle {
	width: 360
	height: 360

	property real relation: 1
	property real l: GUITools.makeCardSize(36, width, height, gamepalce.spacing, relation)
	
	Flow{
		id: gamepalce
		anchors.fill: parent
		spacing: 2
		Repeater{
			model: gameData.cardsQML
			delegate: Rectangle{
				id: card
				height: l * relation
				width: l
				Text{ 
					id: symbol
					anchors.centerIn: parent.Center
					text: modelData.symbol 
				}
				MouseArea{
					anchors.fill: parent;
					onClicked: gameConroller.openCard(index)
				}
				
				states: [
					State {
						name: "Opened"; when: modelData.isOpen;
						PropertyChanges { target: symbol; visible: true; }
						PropertyChanges { target: card; color: "yellow"; }
					},
					State {
						name: "Closed"; when: modelData.isClose;
						PropertyChanges { target: symbol; visible: false; }
						PropertyChanges { target: card; color: "red"; }
					},	
					State {
						name: "Deleted"; when: modelData.isDelete;
						PropertyChanges { target: symbol; visible: false; }
						PropertyChanges { target: card; color: "#ff8d8d" }
					}				
				]
			}
		}
	}
}










